<template>
	<view>
		<view class="container">
			<!-- <button @click="clearStorage">clearStorage</button> -->
			<text class="">{{info.value.title}}</text>
			<image src="../../static/cover.png" mode=""></image>
			<br />
			<br />
			<view class="iceFlexAd">
				<view class="item">
					<p>{{info.value.duration}}'</p>
					<p>考试时长</p>
				</view>
				<view class="item">
					<p>{{info.value.score}}</p>
					<p>卷面总分</p>
				</view>
			</view>
			<view class="btns">
				<button type="primary" @click="toPage('home')">开始考试</button>
				<br />
				<button type="primary" @click="toPage('history')">考试历史</button>
				<br />
				<button type="primary" @click="toPage('welcome')">退出登录</button>
				<br />
				<!-- <button type="primary" @click="toPage('test')">iceTest</button> -->
			</view>
		</view>
		<iceMessage :msgParams="msgParams.value" @iceClose="msgParams.isOpen=false" />
	</view>
</template>
<script setup>
	import {
		onShow,
		onLoad
	} from '@dcloudio/uni-app'
	import {
		onMounted,
		reactive,
		ref
	} from 'vue'
	import {
		postExamIndex
	} from '../../src/api';
	import {
		iceGetStorage, iceRemoveStorage, iceSetStorage
	} from '../../utils/common';
	
	// 值默认1 方便pc端测试
	const info = reactive({
		value: {}
	})
	const msgParams = reactive({
		value: {
			msgType: '',
			messageText: '',
			isOpen: false
		}
	})
	onLoad((e) => {
		if (e.msg) {
			setTimeout(() => {
				msgParams.value = {
					msgType: 'w',
					messageText: e.msg,
					isOpen: true
				}
			}, 1000)
		}
	})
	onMounted(() => {
		postExamIndexs()
	})
	const postExamIndexs = async () => {
		let id = await iceGetStorage('id')
		let uid = await iceGetStorage('userId')
		// 下面六行只有开发环境  调试的时候才能打开
		// if(!id){
		// 	iceSetStorage('id',17)
		// }
		// if(uid){
		// 	iceSetStorage('userId',8)
		// }
		postExamIndex({
			id,
			uid
		}).then(res => {
			info.value = res.data
			iceSetStorage('duration',info.value.duration)
		})
	}
	const toPage = (page) => {
		// page == 'welcome' && iceRemoveStorages()
		uni.navigateTo({
			url: `/pages/${page}/index`
		})
	}
</script>
<style scoped lang="scss">
	$th: 50px;

	.container {
		text {
			display: block;
			height: $th;
			line-height: $th;
			margin: 0 auto;
			text-align: center;
			font-weight: bold;
		}

		image {
			width: 100%;
		}

		.item {
			font-size: 14px;
			text-align: center;

			p:nth-of-type(1) {
				color: #007aff;
			}
		}

		.btns {
			width: 90%;
			margin: 20px auto;
		}

		.clearStorage {
			position: absolute;
			bottom: -20px;
		}
	}
</style>